<template>
	<div v-show="showPage">
		<div style="border-bottom: 1px solid #ddd;">
			<h3>明细报表预览</h3>
		</div>
		<DetailReportComponent :componentModel="componentModel" :previewMode="true" ref="detailReportComponent" @pageChange="currentPageChange"></DetailReportComponent>
	</div>
</template>

<script>
	import DetailReportComponent from '@/components/DetailReportComponent.vue';
	import restUtil from '@/utils/restUtil.js';
	export default {
		name: "DetailReportPreviewPage",
		components:{DetailReportComponent},
		props: ["scope"],
		data() {
			return {
				showPage: false,
				componentModel:{},
			}
		},
		methods: {
			init() {
				var fieldList=this.scope["displayFieldConfigPage"]["fieldList"];
				var columnList=[];
				for(var i=0;i<fieldList.length;i++){
					if(fieldList[i].display==true){
						columnList.push({"columnName":fieldList[i].columnName,
						"name":fieldList[i].name,"viewType":fieldList[i].viewType});
					}
				}
				this.$refs.detailReportComponent.setFieldList(columnList);
				var that = this;
				var data = {
					"json": JSON.stringify(this.scope)
				};
				restUtil.postAction(this,"detailreportdesigner/initReportPreviewPage", data).then(
					function(response) {
						if (response.data.code == 1) {
							that.$refs.detailReportComponent.setData(response.data.detailReportData.tableData,
							response.data.detailReportData.styleMap);
						} else {
							that.$alert(response.data.message, '提示')
						}
				});
			},
			setVisible(visible) {
				this.showPage = visible;
				if (visible) {
					this.init();
				}
			},
			getReturnData() {
				return {};
			},
			getPreviousPage() {
				return "fieldConditionStylePage";
			},
			getNextPage() {
				return undefined;
			},
			isCompletedPage() {
				return true;
			},currentPageChange(currentPage){
				var that=this;
				var data = {
					"json": JSON.stringify(this.scope),
					"page":currentPage
				};
				restUtil.postAction(this,"detailreportdesigner/previewPageDataPage", data).then(
					function(response) {
						if (response.data.code == 1) {
							that.$refs.detailReportComponent.setData(response.data.detailReportData.tableData,
							response.data.detailReportData.styleMap);
						} else {
							that.$alert(response.data.message, '提示')
						}
				});
			}
		},
	}
</script>

<style>
</style>
